<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <h3 id="h3_head" class="h3_header_class">列表</h3>
    <ul id="list_menu" class="ul_class">
        <li>Coffee</li>
        <li>Tea</li>
        <li>Milk</li>
    </ul>
    <h1>Title 1</h1>
    <span>文本内容</span>
    <br>
    <hr>
    <del>测试</del>
    <span>文本内容</span>
    
    <p style="color: red;" >一个段落</p>

    <!-- form -->
    <form action="/update" method="get">
        First name: <input type="password" name="firstname"><br>
        Last name: <input type="text" name="lastname">
        <input type="submit" value="Submit">
    </form>

    <iframe src="https://www.runoob.com/" style="height: 800px;" frameborder="0"></iframe>

    <!-- table -->
    <table border="1">
        <tr>
            <th>博客名称</th> <th>博客作者</th>
        </tr>
        <tr>
            <th>Golang 课程</th> <th>老喻</th>
        </tr>
    </table>

    <!-- div span -->
    <div>
        这是一个div
    </div>
    <div>
        这是一个div
    </div>
    <span>
        这个一个span
    </span>
    <span>
        这个一个span
    </span>

    <p>
        <a href="#C4">查看章节 4</a>
    </p>
        
        <h2>章节 1</h2>
        <p>这边显示该章节的内容……</p>
        
        <h2>章节 2</h2>
        <p>这边显示该章节的内容……</p>
        
        <h2>章节 3</h2>
        <p>这边显示该章节的内容……</p>
        
        <h2><a id="C4">章节 4</a></h2>
        <p>这边显示该章节的内容……</p>

        <!-- html元素加载往后执行的脚步 -->
        <script>
            var h3 = document.getElementById('h3_head')
            h3.innerText = 'js加载后修改'
        </script>
        <style>
            /* p {
                color: red;
            } */

            /* .h3_header_class {
                color: red;
            } */

            /* #h3_head,.h3_header_class,p {
                color: red;
            } */
            * {
                font-size: 14px;
            }
        </style>
</body>
</html>